<%--
  Created by IntelliJ IDEA.
  User: 薛之谦
  Date: 2025/10/14
  Time: 20:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<jsp:include page="header.jsp"/>
<div class="container mt-4">
    <h3><i class="fas fa-graduation-cap"></i> 成绩管理</h3>

    <!-- 筛选区域 -->
    <div class="card my-3">
        <div class="card-body">
            <form class="row g-3">
                <div class="col-md-4">
                    <label for="filterExam" class="form-label">选择考试</label>
                    <select id="filterExam" class="form-select">
                        <option selected>所有考试...</option>
                        <option>2024年第一学期期末考试</option>
                        <option>Web开发技术摸底测试</option>
                    </select>
                </div>
                <div class="col-md-4">
                    <label for="filterStudent" class="form-label">考生姓名/学号</label>
                    <input type="text" class="form-control" id="filterStudent">
                </div>
                <div class="col-md-2 align-self-end">
                    <button type="submit" class="btn btn-primary w-100">筛选</button>
                </div>
            </form>
        </div>
    </div>

    <!-- 成绩列表 -->
    <table class="table table-bordered table-hover">
        <thead class="table-light">
        <tr>
            <th>考试名称</th>
            <th>考生姓名</th>
            <th>提交时间</th>
            <th>客观题得分</th>
            <th>主观题得分</th>
            <th>总分</th>
            <th>批改状态</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <%-- 循环输出成绩记录 --%>
        <tr>
            <td>Web开发技术摸底测试</td>
            <td>张三</td>
            <td>2024-06-25 15:28:10</td>
            <td>50 / 60</td>
            <td>-</td>
            <td>50</td>
            <td><span class="badge bg-success">已完成</span></td>
            <td>
                <button class="btn btn-sm btn-info">查看详情</button>
            </td>
        </tr>
        <tr>
            <td>2024年第一学期期末考试</td>
            <td>李四</td>
            <td>2024-06-30 10:55:00</td>
            <td>70 / 80</td>
            <td>- / 20</td>
            <td>70</td>
            <td><span class="badge bg-warning text-dark">待批改</span></td>
            <td>
                <button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#manualGradeModal">
                    手动批改
                </button>
                <button class="btn btn-sm btn-info">查看详情</button>
            </td>
        </tr>
        </tbody>
    </table>
</div>

<!-- 手动批改 模态框 -->
<div class="modal fade" id="manualGradeModal" tabindex="-1" aria-labelledby="manualGradeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="manualGradeModalLabel">手动批改 - 考生: 李四</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form action="scoreServlet?action=manualGrade" method="post">
                    <%-- 循环输出该考生的所有主观题 --%>
                    <div class="mb-4 p-3 border rounded">
                        <h6>题目 45: (简答题) [10分] 请简述什么是面向对象的三大特征？</h6>
                        <div class="alert alert-secondary">
                            <strong>考生答案:</strong>
                            <p>封装就是把东西包起来，继承就是儿子用爸爸的，多态就是一种东西有多种形态。</p>
                        </div>
                        <div class="row align-items-center">
                            <label class="col-sm-2 col-form-label">得分:</label>
                            <div class="col-sm-4">
                                <input type="number" name="score_q45" class="form-control" max="10" min="0">
                            </div>
                        </div>
                    </div>
                    <div class="mb-4 p-3 border rounded">
                        <h6>题目 46: (论述题) [10分] 谈谈你对Spring框架中IOC和AOP的理解。</h6>
                        <div class="alert alert-secondary">
                            <strong>考生答案:</strong>
                            <p>
                                IOC是控制反转，把对象的创建交给Spring容器管理。AOP是面向切面编程，可以统一处理日志、事务等。</p>
                        </div>
                        <div class="row align-items-center">
                            <label class="col-sm-2 col-form-label">得分:</label>
                            <div class="col-sm-4">
                                <input type="number" name="score_q46" class="form-control" max="10" min="0">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                <button type="submit" class="btn btn-primary">保存批改结果</button>
            </div>
        </div>
    </div>
</div>
<jsp:include page="footer.jsp"/>
